<!--
 * @Description: 该组件可独立使用,详细传入参数可见prop   
                 业务中需要自定义实时消息时建议使用该组件

                 最简单使用例如下：
                  <connection
                       url="./api/sys-socket/server/websocket"
                       或者
                       url="ws://localhost:9529/api/sys-socket/server/websocket"
                       :name='name'
                       :key='name'
                       destination='/user/topic/message'
                       connectType='stomp'
                       @onNewMessage='newMsg'
                       @onSuccess='onSuccess'
                       @onError='onError'
                  ></connection>

                  import connection from '@/components/MsgConnect/VueComponent'

                  export default {
                    components: { connection },
                    data(){
                      return{
                        name:'ws'+Math.random()
                      }
                    },
                    methods:{                      
                      newMsg(msg) {
                          console.log(msg.body)
                      },
                      onSuccess(){
                          console.log('连接成功：'+this.name)
                      },
                      onError(){
                          console.log('连接失败：'+this.name)
                      }
                    }
                  }

                 提供3个事件回调
                 @onNewMessage(response) // response 是接收到的消息体
                 @onSuccess() //链接成功建立时提供的回调，
                 @onError()  //链接出错时提供的回调，                

 * @Version: 1.0
 * @Autor: chen_yt
 * @Date: 2020-11-02 17:15:31
 * @LastEditors: chen_yt
 * @LastEditTime: 2021-10-27 09:03:03
-->


<script>
import Connection from './Connection'

export default {
  name: 'ConnectComponent',
  mixins: [Connection],
  props: {
    //是否链接凤翎服务，是的话会在url后拼接一些参数
    isFksServer: {
      type: Boolean,
      default: true
    },
    name: {
      type: String,
      required: true
    },
    //链接地址。支持以相对地址构建，比如../api/server/xxx
    url: {
      type: String,
      default() {
        return this.VUE_APP_SOCKET_API
      }
    },
    //后端控制器的messagingTemplate.convertAndSendToUser中可设置推送地址地址，该地址与前端消息模板中的订阅地址一致
    //e：消息模板中订阅地址为'/topic/message',后端将消息推送到'/topic/message',前端订阅'/topic/message'
    destination: {
      type: String
    },
    //链接建立方式，现在仅支持stomp及sqmtt
    connectType: {
      type: String,
      default: 'stomp'
    },
    //尝试链接等待5秒，连不上就断开
    connectPendingTime: {
      type: Number,
      default: 5000
    },
    //链接断开后的重连间隔
    reConnectInterval: {
      type: Number,
      default: 1000
    },
    maxReconnect: {
      type: Number,
      default: 15
    }
  },
  mounted() {
    // console.log('创建组件')
  },
  beforeDestroy() {
    // console.log('销毁组件')
  }
}
</script>

